import React, { Component } from 'react';
import IceContainer from '@icedesign/container';
import { Table, Icon, Button } from '@icedesign/base';
import axios from 'axios';
import cookie from 'react-cookies';

const generatorData = () => {
  return Array.from({ length: 5 }).map((item, index) => {
    console.log('item', item);
    return {
      todo: `待办事项 ${index}`,
      memo: `备注说明文案 ${index}`,
      validity: '2017-12-12',
    };
  });
};
const sessionid = cookie.load('sessionId');

export default class SortableTable extends Component {
  static displayName = 'SortableTable';

  static propTypes = {};

  static defaultProps = {};

  constructor(props) {
    super(props);
    this.state = {
      dataSource: generatorData(),
      datagaoxiao: [],
    };
  }
  getdataqiyetab =() => {
    const baseurl = 'http://39.105.21.199:8989/IPEvaluation/evaluateManage/countERAddtRankList.do'
    const params = new URLSearchParams();
    params.append('sessionId', sessionid);
    params.append('eType', '企业单位评价');
    axios.post(baseurl, params).then((response) => {
      console.log('tableqiye', response);
      const msg = response.data.msg;
      if (msg === 'LoginInvalidate') {
        this.props.history.push('/pagelogin');
      }
      // for (let i=0; i<response.data.msg)
      const gxdata = response.data.data;
      const data = gxdata.split('_');
      const array = [];
      for (let i = 0; i < data.length; i++) {
        const gx = data[i].split(',');
        array.push({
          todo: gx[0],
          memo: gx[1],
          validity: gx[2],
        });
        this.setState({ dataqiye: array });
      }
    }).catch((error) => {
      console.log('peiqiye', error);
    });
  }

  componentWillMount() {
    this.getdataqiyetab();
  }

  moveUp = (index) => {
    if (index > 0) {
      const dataSource = this.state.dataSource;
      const prevItem = dataSource[index - 1];
      const currentItem = dataSource[index];
      dataSource.splice(index - 1, 2, currentItem, prevItem);
      this.setState({
        dataSource,
      });
    }
  };

  moveDown = (index) => {
    if (index < this.state.dataSource.length - 1) {
      const dataSource = this.state.dataSource;
      const currentItem = dataSource[index];
      const nextItem = dataSource[index + 1];
      dataSource.splice(index, 2, nextItem, currentItem);
      this.setState({
        dataSource,
      });
    }
  };

  renderOrder = (value, index) => {
    return <span>{index + 1}</span>;
  };

  renderSortButton = (value, index) => {
    return (
      <div>
        <Button
          onClick={this.moveDown.bind(this, index)}
          size="large"
          shape="text"
          disabled={index === this.state.dataSource.length - 1}
        >
          <Icon title="下移" type="descending" />
        </Button>
        <Button
          onClick={this.moveUp.bind(this, index)}
          size="large"
          shape="text"
          disabled={index === 0}
        >
          <Icon title="上移" type="ascending" />
        </Button>
      </div>
    );
  };

  render() {
    return (
      <div className="sortable-table" style={styles.sortableTable}>
        <IceContainer>
          <Table dataSource={this.state.dataqiye} hasBorder={false}>
            <Table.Column width={80} title="顺序" cell={this.renderOrder} />
            <Table.Column width={280} title="单位名称" dataIndex="todo" />
            <Table.Column width={240} title="评分" dataIndex="memo" />
            <Table.Column width={180} title="单位类型" dataIndex="validity" />
            {/*<Table.Column*/}
              {/*width={80}*/}
              {/*title="排序"*/}
              {/*cell={this.renderSortButton}*/}
            {/*/>*/}
          </Table>
        </IceContainer>
      </div>
    );
  }
}

const styles = {
  sortableTable: {},
};
